<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <link type="text/css" rel="stylesheet" href="/stylesheets/bootstrap.min.css" />
  <title>用户列表</title>
</head>

<body>
  <div class="clearfix" style="margin-bottom: 30px;"></div>
  <div class="row">
    <form>
      <div class="col-md-offset-1 col-md-2 margin-bottom-15">
        <input type="text" class="form-control" id="firstName" placeholder="账号" value="">
      </div>
      <div class="col-md-2 margin-bottom-15">
        <input type="text" class="form-control" id="lastName" placeholder="姓名" value="">
      </div>
      <div class="col-md-2 margin-bottom-15">
        <select class="form-control margin-bottom-15" placeholder="角色" id="singleSelect">
          <option>全部</option>
          <option>教师</option>
          <option>学生</option>
        </select>
      </div>
      <div class="col-md-2 margin-bottom-15">
        <label class="checkbox-inline">
          <input type="checkbox" id="inlineCheckbox1" value="option1"> 管理员
        </label>
      </div>
      <div class="row templatemo-form-buttons">
        <div class="col-md-2">
          <button type="submit" class="btn btn-primary">查询</button>
          <button type="reset" class="btn btn-default">重置</button>
        </div>
      </div>
    </form>
  </div>
  <div class="clearfix" style="margin-bottom: 10px;"></div>
  <div class="row">
    <div class="col-md-10 col-md-offset-1">
      <div class="table-responsive">
        <table class="table table-striped table-hover table-bordered">
          <thead>
            <tr>
              <th>序号</th>
              <th>账号</th>
              <th>姓名</th>
              <th>角色</th>
              <th>联系电话</th>
              <th>注册时间</th>
              <th>操作</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>1</td>
              <td>admin</td>
              <td>张三</td>
              <td>超级管理员</td>
              <th>2020-1-12</th>
              <td>
                <a href="#" class="btn btn-default">删除</a>
                <a href="#" class="btn btn-default">查看</a>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
      <ul class="pagination pull-right">
        <li class="disabled"><a href="#">&laquo;</a></li>
        <li class="active"><a href="#">1 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">2 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">3 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">4 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">5 <span class="sr-only">(current)</span></a></li>
        <li><a href="#">&raquo;</a></li>
      </ul>
    </div>
  </div>
</body>

</html>